<template>
  <div class="wrap">
  	<!-- header -->
  	<header-v></header-v>
  	
  	<!-- content -->
  	<div class="index-content">
		<div class="about">
			<div class="about_content">
				<p>某某玩具集团有限公司</p>
				<span>本厂以生产传统铁制玩具著称，生产的铁制、机械类玩具造型古朴、构思精巧、色泽鲜艳，动作栩栩如生，极富情趣，为国内外客商好评，近年来已被国内外收藏爱好者视为珍品。</span>
			</div>
			<router-link to="/about" title="关于我们" class="btn">MORE+</router-link>
		</div>
		
		<div class="product">
			<div class="title">
				<p>最新产品</p>
				<span>Product toy classification</span>
			</div>
			<div class="product_content">
				<grid :rows="2">
					<grid-item :label="'儿童帐篷 Z003'" link="/" >
						<img slot="icon" src="../assets/2005112738056345_7lpg.jpg" alt="儿童帐篷 Z003" />
					</grid-item>
					<grid-item :label="'儿童帐篷-Z00*'" link="/" >
						<img slot="icon" src="../assets/productmgmtresourceservlet(12)_69oo.jpg" alt='儿童帐篷-Z00*' />
					</grid-item>
				</grid>
				<grid :rows="2">
					<grid-item :label="'儿童帐篷-Z012'" link="/" >
						<img slot="icon" src="../assets/productmgmtresourceservlet(10)_2wo8.jpg" alt="儿童帐篷-Z012" />
					</grid-item>
					<grid-item :label="'自控飞机'" link="/" >
						<img slot="icon" src="../assets/abc_jvz9.jpg" alt='自控飞机' />
					</grid-item>
				</grid>
				<grid :rows="2">
					<grid-item :label="'鱼形旋转升降飞机'" link="/" >
						<img slot="icon" src="../assets/20080308050227_51gn.jpg" alt="鱼形旋转升降飞机" />
					</grid-item>
					<grid-item :label="'组合滑梯'" link="/" >
						<img slot="icon" src="../assets/12884620_1_skaf.jpg" alt='组合滑梯' />
					</grid-item>
				</grid>
				<router-link to="/proList" title="产品中心" class="btn">MORE+</router-link>
			</div>
		</div>
		
		<div class="news">
			<div class="title">
				<p>最新动态</p>
				<span>New Center</span>
			</div>
			<div class="news_content">
				<img src="../assets/3_rnwx.jpg" alt='最新动态' />
				<ul>
					<li>
						<router-link to="/newsMsg" title="">我们以同行业可比上市公司作为某某玩</router-link>
						<span>2017-05-12</span></li>
					<li>
						<router-link to="/newsMsg" title="">募集资金将投向益智玩具生产基地建</router-link>
						<span>2017-05-12</span>
					</li>
					<li>
						<router-link to="/newsMsg" title="">公司产品以塑胶积木类益智玩具为主</router-link>
						<span>2017-05-12</span>
					</li>
					<li>
						<router-link to="/newsMsg" title="">新款12生肖麦兜猪猪 麦兜形象</router-link>
						<span>2017-05-12</span>
					</li>
					<li>
						<router-link to="/newsMsg" title="">五一节快乐！</router-link>
						<span>2017-05-12</span>
					</li>
					<li>
						<router-link to="/newsMsg" title="">买玩具，挑选比嘴大的更安全</router-link>
						<span>2017-05-12</span>
					</li>
				</ul>
				<router-link to="/newsList" title="产品中心" class="btn">MORE+</router-link>
			</div>
		</div>
  	</div>
  	
  	<!-- footer -->
  	<footerV></footerV>
  </div>
</template>

<script>
import header from './public/header'
import footer from './public/footer'
import { Grid, GridItem } from 'vux'

export default {
	components: {
		headerV : header, footerV : footer, Grid, GridItem
	},
	data () {
		return {
		}
	},
	methods : {
  
	}
}
	
</script>


<style type="text/css">
	/* index.style */
	
	.index-content .about{padding:0.2rem 0.1rem;}
	.about_content p{color:#5a5a5a; text-align:center; line-height:0.4rem;}
	.about_content span{color:#999; line-height:1.5em;}
	.index-content .btn{color:#fff; margin:0.2rem auto; font-weight:blod; line-height:0.4rem; height:0.4rem; width:1.1rem; background:rgba(112,232,168,1); display:block; border-radius:0.5rem; text-align:center; }
	.product{width:100%; background:#ffc3a7; padding-bottom:0.1rem;}
	.product .weui-grids .weui-grid{padding:0 !important; width:47% !important;}
	.product .weui-grids a:nth-of-type(1n){margin-left:0.03rem;}
	.product .weui-grids a:nth-of-type(2n){margin-left:0.126rem;}
	.product .weui-grid__icon{height:1.53rem !important; width:100% !important; margin:0 !important;}
	.product .weui-grid__label span{color:#fff; font-size:0.12rem;}
	.product .title{color:#fff; padding:0.55rem 0 0.1rem; text-align:center; background:url('../assets/ypz9.jpg') center 0 no-repeat; background-size:100% 0.35rem !important;}
	.product .title p{background:url('../assets/solid.png') center center no-repeat; font-size:0.17rem;}
	
	.news .title{color:#999; padding:0.3rem 0 0.1rem; text-align:center; }
	.news .title p{background:url('../assets/solid2.png') center center no-repeat; font-size:0.17rem; color:#666;}
	.news_content img:nth-of-type(1){width:100%; margin-bottom:0.1rem;}
	.news_content li{border-bottom:0.01rem dashed #e2e2e2; height:0.31rem; line-height:0.31rem; }
	.news_content li a{background:url('../assets/10.png') 0.05rem center no-repeat; background-size:0.1rem 0.1rem !important; padding-left:0.2rem; color:#5a5a5a; -webkit-transition:0.2s; transition:0.2s;}
	.news_content li a:hover{color:#70e8a8;}
	.news_content li span{float:right; margin-right:0.04rem; color:#929292; line-height:0.31rem;}
</style>


































